<template>
    <div>
        <div class='video_title'>
            <van-icon name="arrow-left" class="icon" @click="goBack"/>
            <p>学习记录</p>
        </div>
        <van-tabs v-model="active" animated color='#327BFF'>
            <van-tab title="课程学习统计" name="3">
                <studyRecord></studyRecord>
            </van-tab>
            <van-tab title="专项练习统计" name="1">
                <practiceRecord></practiceRecord>
            </van-tab>
            <van-tab :title="title_name" name="2">
                <examRecord :titleName='title_name'></examRecord>
            </van-tab>
        </van-tabs>
    </div>
</template>

<script>
import practiceRecord from './practiceRecord.vue'
import examRecord from './examRecord.vue'
import studyRecord from './studyRecord.vue'
import{getsubject_id}from'@/utils/auth.js'
import{mapGetters}from 'vuex'
export default {
    components:{
        practiceRecord,
        examRecord,
        studyRecord
    },
    computed:{
        ...mapGetters(['userinfor']),
    },
    data() {
        return {
            active:'3',
            title_name:'模拟考试统计',
            gz:'',
        }
    },
    methods: {
        goBack(){
            this.$router.go(-1)
        }
    },
    created() {
        this.gz = this.userinfor.filter(item=>item.subject_id==getsubject_id())[0].gz
        if(this.gz=='一般工贸'||this.gz=='职业卫生'){
            this.title_name='正式考试统计'
        }else{
            this.title_name='模拟考试统计'
        }
        if(!this.qyType('lapengfei')){
            this.title_name='正式考试统计'
        }
    },
}
</script>

<style lang="scss" scoped>
.video_title{
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: #327BFF;
    color:#fff;
    height:2.75rem;
    
    p{
        margin: 0;
        width: calc(100vw - 64px);
        display: flex;
        justify-content: center;
    }
    .icon{
        font-size: 1.25rem;
    }
}
</style>